<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<!-- 标题 -->
	<title>渔人码头</title>
	<!-- 关键词 -->
	<meta name="keywords" content="" />
	<!-- 网站简介 -->
    <meta name="description" content="" />
    <!-- 自适应屏幕 -->
    <meta name="viewport" content="width=device-width,height=device-height,inital-scale=1.0,maximum-scale=1.0,user-scalable=no;">
	<!-- IE兼容 -->
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<!-- 最新 Bootstrap 核心 CSS 文件 -->
	<link rel="stylesheet" href="css/bootstrap.css">
	<!-- 手机滚动 css 文件 -->
	<link href="css/mobiscroll.core-2.5.2.css" rel="stylesheet" type="text/css" />
    <!-- 核心 CSS 文件 -->
	<link rel="stylesheet" href="css/style.css" type="text/css">
</head>
<body class="index-bg">
    <!-- Start pay -->
    <div class="pay">
        <div class="pay-top">
            <div class="container">
                <div class="pay-pa">
                    <a href="index.html"></a>提交订单
                </div>
            </div>
        </div>
        <div class="pay-center">
            <div class="container">
                <div class="pay-center-info">
                    <div class="title">
                        选择用餐人数：
                        <select id="person-more" class="demo-test-select" data-role="none">
                            <option value="1">1</option>
                            <option value="2">2</option>
                            <option value="3">3</option>
                            <option value="4">4</option>
                            <option value="5">5</option>
                            <option value="6">6</option>
                            <option value="7">7</option>
                            <option value="8">8</option>
                            <option value="9">9</option>
                            <option value="10">10</option>
                            <option value="11">11</option>
                            <option value="12">12</option>
                            <option value="13">13</option>
                            <option value="14">14</option>
                            <option value="15">15</option>
                            <option value="16">16</option>
                            <option value="17">17</option>
                            <option value="18">18</option>
                            <option value="19">19</option>
                            <option value="20">20</option>
                        </select>
                        人<span class="red">（必选）</span>
                    </div>
                    <div class="people-select">
                    	<button id="show" onClick="cal();">选择人数</button>
                    </div>
                </div>
            </div>   
        </div>
        <div class="pay-center">
            <div class="container">
                <div class="pay-center-info">
                    <div class="title">
                        已点：
                    </div>
                    <div class="cart-menu ">
	                    <div class="cart-menu-list">
	                    	<div class="cart-menu-top">
                		    	<img src="images/avater.jpg" alt="">
                                <span class="red">小诺</span>
	                    	</div>
	                    	<div class="cart-menu-bottom clearfix">
	                    		<div class="left">
	                    		    糯米饭
	                    		</div>
	                    		<div class="right clearfix">
                                    <div class="cleft">
                                        ¥85.00*1
                                    </div>
                                    <div class="cright">
                                        ¥85.00
                                    </div>
                                </div>
	                    	</div>
	                    </div>
                        <div class="cart-menu-list">
                            <div class="cart-menu-top">
                                <img src="images/avater.jpg" alt="">
                                <span class="red">小诺</span>
                            </div>
                            <div class="cart-menu-bottom clearfix">
                                <div class="left">
                                    糯米饭
                                </div>
                                <div class="right clearfix">
                                    <div class="cleft">
                                        ¥85.00*1
                                    </div>
                                    <div class="cright">
                                        ¥85.00
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="cart-menu-list">
                            <div class="cart-menu-top">
                                <img src="images/avater.jpg" alt="">
                                <span class="red">小诺</span>
                            </div>
                            <div class="cart-menu-bottom clearfix">
                                <div class="left">
                                    糯米饭
                                </div>
                                <div class="right clearfix">
                                    <div class="cleft">
                                        ¥85.00*1
                                    </div>
                                    <div class="cright">
                                        ¥85.00
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="cart-menu-list">
                            <div class="cart-menu-top">
                                <img src="images/avater.jpg" alt="">
                                <span class="red">小诺</span>
                            </div>
                            <div class="cart-menu-bottom clearfix">
                                <div class="left">
                                    糯米饭
                                </div>
                                <div class="right clearfix">
                                    <div class="cleft">
                                        ¥85.00*1
                                    </div>
                                    <div class="cright">
                                        ¥85.00
                                    </div>
                                </div>
                            </div>
                        </div>

                    </div>
                    <div class="cart-menu-total clearfix">
                    	<div class="left">总共</div>
                    	<div class="right red">¥210</div>
                    </div>
                </div>
            </div>   
        </div>
       
        <div class="pay-center cart-bottom">
            <div class="container">
                <div class="pay-center-info">
                    <div class="title">
                        备注：
                    </div>
                    <textarea class="form-control cart-a" rows="3"></textarea>
                </div>
            </div>   
        </div>
       
        <!-- 不可提交 -->
        <div class="pay-bottom pay1 db">
            <a>提交</a>
        </div>
        
        <!-- 可提交 -->
        <div class="pay-bottom pay2 db dn">
            <form action="message.html" method="post">
                <input type="submit" value="提交"/> 
            </form>
            
        </div>

    </div>
    <!-- End pay -->

	<!-- jQuery文件 -->
    <script src="js/jquery.min.js"></script>
	<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
	<script src="js/bootstrap.min.js"></script>
    <script src="js/mobiscroll.core-2.5.2.js"></script>
    <script src="js/mobiscroll.select-2.5.1.js"></script>
    
    <script type="text/javascript">
        $(function () {
            $('#person-more').scroller('destroy').scroller({ preset: 'select' });
            $('#show').click(function () {
                $('#person-more').mobiscroll('show');
                return false;
            });
        });   
    </script>
    <script>
        function cal() {
            if($("#person-more_dummy").length>0){
                $(".pay1").addClass("dn");
                $(".pay2").removeClass("dn");                 
            }  
            $("#person-more_dummy").css("color","#666");   
        } 
 
    </script>
</body>
</html>